昨天終於把「泰語小旅伴」的首頁做得比較像一個手機 App 了。

從最初只有簡單歡迎文字的網頁，變成有五個旅遊情境、學習進度和底部導覽的首頁。雖然目前還只是靜態畫面，但至少已經有了第一個可以驗收的成果。

不過，接下來還要繼續加入課程、發音和其他功能，我開始需要面對一個問題：

如果之後請 AI 修改程式，結果把現在已經完成的畫面弄壞了，該怎麼辦？

這次並不是 Codex 已經把首頁改壞，而是我想先把目前確認正常的狀態保存起來，再繼續往下做。

所以今天的任務，就是第一次使用 Git。

為什麼需要保存版本？

前面幾天的開發方式，是先和 ChatGPT 討論需求，再交給 Codex 修改專案，最後由我自己驗收。

到目前為止，已經建立了基本專案，也完成第一版靜態首頁。但程式不會停在這裡，接下來只要開始加入真正的互動功能，Codex 就可能需要繼續修改 index.html、style.css 或其他檔案。

如果修改後才發現原本正常的東西壞掉了，總不能只靠自己回想之前的程式碼長什麼樣子。

所以和 ChatGPT 討論後，我們決定開始使用 Git 來保存專案版本。

對現在的我來說，可以先把 Git 理解成：

幫程式專案記錄不同階段的版本，讓之後可以查看修改紀錄，也有機會回到先前保存的狀態。

不過，Git 不會自動替每一次檔案修改建立 commit，還是需要自己決定什麼時候保存版本。

這次就先從第一個版本開始。

Git 和 GitHub 是一樣的東西嗎？

這裡也補充一個初學者容易混淆的概念：Git 和 GitHub 並不是同一個東西。

Git 是版本控制工具，可以在自己的電腦上記錄專案的修改歷史。

GitHub 則是提供 Git 儲存庫託管等功能的平台，可以用來存放專案及進行協作。

這次我們先處理的是 Git，沒有進行 GitHub 遠端儲存庫的設定。

也就是說，就算目前沒有把專案上傳到 GitHub，仍然可以先在本機建立版本紀錄。

不過，本機 Git 紀錄不等於異地備份。如果電腦裡的整個專案資料夾遺失，放在裡面的版本紀錄也可能一起遺失。

這個階段，我先把重點放在學會保存版本，其他用途之後再慢慢理解。

把 Git 初始化交給 Codex

和前面建立專案一樣，這次實際操作交給 Codex。

根據開發紀錄，這次的工作包括初始化 Git repository、建立 .gitignore，以及替目前已完成的首頁建立第一個 commit。

另外，Git 作者資訊只設定在目前這個專案，不修改全域設定。

Codex 初始化後，專案裡會多出一個隱藏的 .git 資料夾。這是 Git 用來保存版本資料的地方，不是平常需要直接修改的網頁程式檔案。

專案也建立了一份：

.gitignore

這個檔案可以告訴 Git，哪些尚未被追蹤的檔案或資料夾應該忽略。

這次設定排除的內容，包括部分作業系統、編輯器產生的檔案、記錄檔、node_modules 和本機執行資料。

這些東西不一定屬於 App 本身需要保存的程式內容，因此可以先排除，避免把不必要的檔案一起納入版本管理。

不過，哪些檔案該排除，還是要依照專案需求判斷，並不是所有額外產生的檔案都應該忽略。

第一次 commit，結果沒有成功

原本以為初始化 Git 後，就可以直接建立第一個版本，沒想到這裡也遇到了一個小問題。

Codex 第一次準備建立 commit 時，發現 Git 還沒有設定作者姓名和 Email，因此暫停了操作，請我提供資料。

原來 Git 建立 commit 時，還需要記錄作者資訊。

這次不是 App 本身的程式出錯，而是版本控制工具需要的設定還沒準備好。

後來我們決定只在目前的 repository 設定作者資訊，不直接修改整台電腦的全域 Git 設定。

設定完成之後，Codex 才繼續建立第一個 commit。

這也是我第一次實際碰到 Git 的設定問題。原本只是想把目前的成果保存下來，沒想到連版本控制工具本身，也有一些需要先理解的地方。

第一個 commit 終於建立了

最後，Codex 成功建立第一個 commit，紀錄如下：

3ddd34e
feat: create initial Thai Buddy homepage

其中，3ddd34e 是這次 commit 的簡短識別碼，可以用來識別這筆版本紀錄；feat: create initial Thai Buddy homepage 則是 commit 訊息，用來描述這次保存的內容。

這個版本包含目前的專案骨架，以及已經完成的第一版首頁。

根據 Codex 的紀錄，當時使用的分支是：

master

而 Git 的工作目錄狀態是：

working tree clean

working tree clean 可以先簡單理解成：以當時的 Git 狀態來看，沒有待提交的追蹤檔案變更，也沒有需要回報的未追蹤檔案。

不過，這不代表程式完全沒有問題，更不代表所有功能都通過測試。

它只是在告訴我，目前沒有待處理的工作目錄變更。

對這次來說，真正重要的是：

第一版首頁終於有了一筆可以查找的 Git 版本紀錄。

Commit 就是一般的存檔嗎？

剛開始接觸 Git，很容易直接把 commit 想成一般的「儲存檔案」，但兩者還是不太一樣。

平常修改 index.html 後按下儲存，只是把目前的修改寫進檔案裡。

Git commit 則是在版本控制中建立一筆紀錄，保存當時納入提交的專案狀態。

我先用這個簡化流程來理解：

修改程式
    ↓
儲存檔案
    ↓
檢查修改內容
    ↓
將要提交的變更加入暫存區
    ↓
建立 commit
    ↓
留下版本紀錄

這是用來理解 Git 的基本流程，這次實際操作仍然是由 Codex 完成，我還沒有親手熟悉每一個指令。

但至少我開始理解，平常的檔案儲存和 Git 版本紀錄並不是同一回事。

如果希望未來能回頭查看某個功能完成時的狀態，就需要在適當的時間建立 commit。

有了 Git，就不怕 AI 改壞了嗎？

這是我今天最想搞清楚的問題。

目前至少可以確定，我們已經成功保存了第一版首頁。

接下來即使 Codex 繼續修改程式，也可以透過 Git 查看後續修改和這個版本之間的差異。

如果真的需要回到先前的狀態，Git 也提供相關的操作方式。

不過，這次的實際紀錄只有初始化 Git、處理作者資訊，以及成功建立第一個 commit。

目前還沒有真的發生 AI 改壞程式的情況，也沒有實際操作過版本還原。

所以現在只能說，我們先建立了一個版本保存的起點。至於怎麼比較不同版本、如何還原，之後還需要繼續學習。

而且真的要還原時，也需要先確認目前有沒有尚未保存的修改，避免把後來做的工作一起弄丟。

至少有了第一個 commit，接下來繼續開發時，就不再只是依靠自己記得之前改過什麼。

我開始建立的版本保存習慣

經過今天的操作，和 ChatGPT 討論後，我們把接下來的開發流程整理成：

先討論一個小功能
    ↓
交給 Codex 實作
    ↓
檢查修改內容
    ↓
實際測試、驗收
    ↓
確認符合需求
    ↓
建立 Git commit
    ↓
再進入下一個功能

對現在的我來說，這個流程比一口氣叫 Codex 完成整個 App 更容易掌握。

因為每次只做一個小功能，修改範圍比較清楚，也比較容易知道某個版本到底完成了哪些事情。

而且在確認正常之後才 commit，就能讓版本紀錄對應到一個相對明確、已經驗收過的開發階段。

當然，這不代表每個 commit 都一定完全沒有 Bug，而是希望不要把自己還沒確認的結果，直接當成已完成的版本。

今天學到什麼？

今天沒有替「泰語小旅伴」加入新的學習功能，但第一次建立了 Git 版本紀錄。

從初始化 repository、建立 .gitignore，到因為作者資訊不足而暫停 commit，最後才成功保存第一版首頁，整個過程也不是一次就完成。

對現在的我來說，今天最重要的收穫不是記住多少 Git 指令，而是理解：

寫程式不只是一直新增功能，也需要有辦法管理已經完成的成果。

目前第一版首頁已經有了 Git 紀錄，接下來可以繼續加入真正的課程功能。

不過，首頁上雖然有五個旅遊情境，但教材目前還沒有真正建立起來。

如果接下來要加入「基本問候」，應該把中文、泰文、羅馬拼音直接寫進 HTML 嗎？

還是應該另外找一個地方保存教材資料？

下一篇，就來處理第一份泰語課程資料，讓「泰語小旅伴」開始有真正可以使用的學習內容。